<template>
    <div class="wrapper">
        <top-header title="车辆照片录入"></top-header>
        <scroller :show-scrollbar="false" class="content">
            <!-- <text class="cont_title">车辆图片</text> -->
            <div>
                <text class="car_image_angle">左前45度(必填)：</text>
                <image class="car_image" :src="imgPath1" @click="upload(1)"></image>
            </div>
            <div>
                <text class="car_image_angle">正前(必填)：</text>
                <image class="car_image" :src="imgPath2" @click="upload(2)"></image>
            </div>
            <div>
                <text class="car_image_angle">右后45度(必填)：</text>
                <image class="car_image" :src="imgPath3" @click="upload(3)"></image>
            </div>
            <div>
                <text class="car_image_angle">中控台(必填)：</text>
                <image class="car_image" :src="imgPath4" @click="upload(4)"></image>
            </div>
            <div>
                <text class="car_image_angle">方向盘：</text>
                <image class="car_image" :src="imgPath5" @click="upload(5)"></image>
            </div>
                <div>
                <text class="car_image_angle">右前45度：</text>
                <image class="car_image" :src="imgPath6" @click="upload(6)"></image>
            </div>
            <div>
                <text class="car_image_angle">轮胎：</text>
                <image class="car_image" :src="imgPath7" @click="upload(7)"></image>
            </div>
            <div>
                <text class="car_image_angle">发动机舱：</text>
                <image class="car_image" :src="imgPath8" @click="upload(8)"></image>
            </div>
            <div>
                <text class="car_image_angle">后排座椅：</text>
                <image class="car_image" :src="imgPath9" @click="upload(9)"></image>
            </div>
            <div class="button">
                <wxc-button text="发布"
                    @wxcButtonClicked="next" :btnStyle="btnStyle"></wxc-button>
            </div>
        </scroller>
    </div>
</template>
<script>
import { WxcButton } from 'weex-ui';
import header from '../common/header'
export default {
    components: { WxcButton,
        'top-header': header,
    },
    data () {
        return {
            token: '',
            imgPath1: 'bmlocal://assets/acw/car1.jpg',
            imgPath2: 'bmlocal://assets/acw/car2.jpg',
            imgPath3: 'bmlocal://assets/acw/car3.jpg',
            imgPath4: 'bmlocal://assets/acw/car4.jpg',
            imgPath5: 'bmlocal://assets/acw/car5.jpg',
            imgPath6: 'bmlocal://assets/acw/car6.jpg',
            imgPath7: 'bmlocal://assets/acw/car7.jpg',
            imgPath8: 'bmlocal://assets/acw/car8.jpg',
            imgPath9: 'bmlocal://assets/acw/car9.jpg',
            btnStyle: {
                'background-color': '#1E90FF',
            },
            uploadParam: '',
            nextClick: true,
        }
    },
    created () {
        let user = this.$storage.getSync('UserInfo')
        this.token = user.token
        this.$router.getParams().then(resData => {
            console.log(resData)
            this.uploadParam = resData
        })
    },
    methods: {
        // 返回
        back () {
            this.$router.back();
        },
        // 上传图片
        upload (param) {
            this.uploadImage().then(res => {
                switch (param) {
                    case 1:
                        this.imgPath1 = res
                        break
                    case 2:
                        this.imgPath2 = res
                        break
                    case 3:
                        this.imgPath3 = res
                        break
                    case 4:
                        this.imgPath4 = res
                        break
                    case 5:
                        this.imgPath5 = res
                        break
                    case 6:
                        this.imgPath6 = res
                        break
                    case 7:
                        this.imgPath7 = res
                        break
                    case 8:
                        this.imgPath8 = res
                        break
                    case 9:
                        this.imgPath9 = res
                        break
                    default:
                        break
                }
            }, error => {
                this.$notice.toast({ message: '上传失败'})
            })
        },
        // 上传图片接口
        uploadImage () {
            return new Promise((resolve, reject) => {
                this.$image.pickAndUpload({
                    allowCrop: false,             // 是否允许编辑（只有当 maxCount == 1时 此参数才会生效） 默认是false
                    params: {},                  // 传递的参数
                    header: {}                   // 自定义请求 header
                })
                .then(resData => {
                    console.log(resData)    // [url1, url2...]
                    // this.$notice.toast({ message: resData[0].data.url})
                    resolve(resData[0].data.url)
                }, error => {
                    console.log(error)
                    reject(error)
                })
            })
        },
        // 发布买车
        next () {
            //左前45°必填
            if (this.imgPath1.indexOf('car1.jpg') != -1) {
                this.$notice.toast({ message: '请上传左前45度照片'})
                return
            }
            //正前必填
            if (this.imgPath2.indexOf('car2.jpg') != -1) {
                this.$notice.toast({ message: '请上传正前照片'})
                return
            }
            //右后45°必填
            if (this.imgPath3.indexOf('car3.jpg') != -1) {
                this.$notice.toast({ message: '请上传右后45度照片'})
                return
            }
            //中控必填
            if (this.imgPath4.indexOf('car4.jpg') != -1) {
                this.$notice.toast({ message: '请上传中控台照片'})
                return
            }
            if (this.imgPath5.indexOf('car5.jpg') != -1) {
                this.imgPath5=null;
                // return
            }
            if (this.imgPath6.indexOf('car6.jpg') != -1) {
                this.imgPath6=null;
                // return
            }
            if (this.imgPath7.indexOf('car7.jpg') != -1) {
                this.imgPath7=null;
                // return
            }
            if (this.imgPath8.indexOf('car8.jpg') != -1) {
                this.imgPath8=null;
                // return
            }
            if (this.imgPath9.indexOf('car9.jpg') != -1) {
                this.imgPath9=null;
                // return
            }
            this.uploadParam.j_selectImage = this.imgPath1 + ';' +
                                this.imgPath2 + ';' +
                                this.imgPath3 + ';' +
                                this.imgPath4 + ';' +
                                this.imgPath5 + ';' +
                                this.imgPath6 + ';' +
                                this.imgPath7 + ';' +
                                this.imgPath8 + ';' +
                                this.imgPath9
            if (!this.nextClick) {
                this.$notice.toast({ message: '正在提交，请稍后'})
                return
            } 
            this.nextClick = false
            this.$fetch({
                method: 'POST',    // 大写
                name: 'cars.addSellCars', //当前是在apis中配置的别名，你也可以直接绝对路径请求 如：url:http://xx.xx.com/xxx/xxx
                data: this.paramPack(this.uploadParam),
                header: {
                    'X-TMACW-APP-Token': this.token
                }
            }).then(resData => {
                // 成功回调
                this.isShowLoad = false;
                console.log(resData)
                if(resData && resData.errno == 0){
                    this.$router.back({
                        length: 2,
                        type: 'PUSH',
                        callback() {
                            // 返回成功回调
                        }
                    })
                }
                this.$notice.toast({ message: resData.errmsg})
                this.nextClick = true
            }, error => {
                // 错误回调
                this.isShowLoad = false;
                console.log(error)
                reject(error)
                // this.$notice.toast({ message: "登录失败, 请重试"})
            })
        },
        // 参数封装
        paramPack (params) {
            let result = {}
            if (params.aid) {
                result.aid = params.aid // 省份
            }
            if (params.cid) {
                result.cid = params.cid // 城市
            }
            if (params.p_brand) {
                result.p_brand = params.p_brand // 品牌
            }
            if (params.p_subbrand) {
                result.p_subbrand = params.p_subbrand // 车系
            }
            if (params.p_subsubbrand) {
                result.p_subsubbrand = params.p_subsubbrand // 款式
            }
            if (params.p_model) {
                result.p_model = params.p_model // 车型
            }
            if (params.p_price) {
                result.p_price = params.p_price // 预售价格
            }
            if (params.p_newprice) {
                result.p_newprice = params.p_newprice // 新车价格
            }
            if (params.p_tax) {
                result.p_tax = params.p_tax // 购置税
            }
            if (params.p_emission) {
                result.p_emission = params.p_emission // 排放标准
            }
            if (params.p_color) {
                result.p_color = params.p_color // 颜色
            }
            if (params.p_gas) {
                result.p_gas = params.p_gas // 排量
            }
            if (params.p_transmission) {
                result.p_transmission = params.p_transmission // 变速箱
            }
            if (params.p_year) {
                result.p_year = params.p_year // 上牌年份
            }
            if (params.p_month) {
                result.p_month = params.p_month // 上牌月份
            }
            if (params.p_kilometre) {
                result.p_kilometre = params.p_kilometre // 行驶里程
            }
            if (params.p_country) {
                result.p_country = params.p_country // 产地
            }
            if (params.p_surveydate) {
                result.p_surveydate = params.p_surveydate // 年检到期
            }
            if (params.p_insurancedate) {
                result.p_insurancedate = params.p_insurancedate // 交强险到期
            }
            if (params.hlconfig) {
                result.hlconfig = params.hlconfig // 亮点配置
            }
            if (params.j_selectImage) {
                result.j_selectImage = params.j_selectImage // 图片
            }
            if (params.p_details) {
                result.p_details = params.p_details // 汽车描述
            }
            if (params.p_username) {
                result.p_username = params.p_username // 车主姓名
            }
            if (params.p_tel) {
                result.p_tel = params.p_tel // 车主电话
            }
            if (params.carBrandAdd) {
                result.carBrandAdd = params.carBrandAdd // 车牌所在地
            }
            if (params.transferTimes) {
                result.transferTimes = params.transferTimes // 过户次数
            }
            if (params.lookCarAdd) {
                result.lookCarAdd = params.lookCarAdd // 看车地点
            }
            if (params.mortgage) {
                result.mortgage = params.mortgage // 车辆是否有抵押
            }
            if (params.commercialInsurance) {
                result.commercialInsurance = params.commercialInsurance // 商业险到期
            }
            if (params.carLabel) {
                result.carLabel = params.carLabel // 车源标签描述
            }
            if (params.sellType) {
                result.sellType = params.sellType // 卖家类型
            }
            if (params.loan) {
                result.loan = params.loan // 是否贷款救急
            }
            if (params.p_transferFee) {
                result.p_transferFee = params.p_transferFee // 是否包含过户费
            }
            if (params.p_supportStaging) {
                result.p_supportStaging = params.p_supportStaging // 是否支持分期
            }
            if (params.margin) {
                result.margin = params.margin // 保证金
            }
            if (params.bargain_count) {
                result.bargain_count = params.bargain_count
            }
            if (params.bargain_maxprice) {
                result.bargain_maxprice = params.bargain_maxprice
            }
            if (params.bargain_minprice) {
                result.bargain_minprice = params.bargain_minprice
            }
            if (params.is_bargain) {
                result.is_bargain = params.is_bargain
            }
            if (params.uid) {
                result.uid = params.uid
            }
            if (params.shop_support) {
                result.shop_support = params.shop_support
            }
            if (params.store_id) {
                result.store_id = params.store_id
            }
            return result
        }
    }
}
</script>
<style>
.iconfont {
    font-family: iconfont;
}
.wrapper{
    background-color: #fff;
}
.cont_title{
    background-color: #1E90FF;
    text-align: center;
    color: #fff;
    font-size: 36px;
    height: 80px;
    line-height: 80px;
}
.car_image_angle{
    color: #666;
    height: 60px;
    line-height: 60px;
    margin: 10px;
}
.car_image{
    height: 400px;
    margin: 10px;
}
.button{
    align-items: center;
    margin-top: 40px;
    margin-bottom: 40px;
}
</style>
